<!-- 
  动态表单组件(含验证)  variableForm 
  ZooMze 2019/11/28
  
  props: {
    form: {
      ...
    },
    table: {
      ...
    }
  }

  //get final data (get )
  getFormData() {
    ...
    return result // 验证成功返回对象 验证失败返回false
  }
-->
<template>
  <div class="zoomze-form" ref="zoomzeForm">
    
    <form v-if="form && form.length > 0">
      <van-cell-group v-for="(formItem, formIndex) in formData" :key="`表单项${formIndex}`" class="group-wrap">
        <!-- 基础表单 -->
        <!-- 输入框 -->
        <van-cell v-if="checkFormItemVisible(formItem, '0', '1')" class="padding-0" 
            :ref="`inputRef${formIndex}`">
          <van-field
            :required="formItem.confirmation == '1' ? true : false"
            v-model="formItem.inputvalue"
            :type="formItem.dbtype == '2' ? 'number' : 'text'"
            :label="formItem.fromname"
            :placeholder="formItem.readonly == 'readonly'?'':'请输入'"
            clearable
            input-align="right"
            :clickable="formItem.dbtype == '3' ? true : false"
            :readonly="formItem.dbtype == '3' || formItem.readonly == 'readonly' ? true : false"
            @click="e => {showNumberKeyboard(formItem, formIndex, e, formItem.dbtype)}"
            />
            <div v-if="formItem.dbtype == '3'" class="custom-cell cell-added">
              <div class="cell-title">大写</div>
              <div class="van-ellipsis">{{ $common.numberChinese(formItem.inputvalue) }}</div>
            </div>
            <!-- 自定义数字键盘(仅在需要使用的情况下渲染) -->
            <van-number-keyboard
              @touchmove.native="touchMoving"
              v-if="tempIndex  == formIndex && formItem.dbtype == '3'"
              :show="keyboardVisible"
              extra-key="."
              v-model="formData[tempIndex].inputvalue"
              close-button-text="完成"
              @blur="afterInput(formIndex)"
            />
        </van-cell>
        
        <!-- 输入域 -->
        <van-cell v-if="checkFormItemVisible(formItem, '0', '2')" class="padding-0">
          <van-field
            :required="formItem.confirmation == '1' ? true : false"
            class="textarea-field"
            :label="formItem.fromname"
            type="textarea"
            rows="2"
            autosize
            clearable
            v-model="formItem.inputvalue"
            maxlength="9999"
            :show-word-limit="false"
            placeholder="请输入内容..."/>
        </van-cell>
        <!-- 单选 -->
        <van-cell
          v-if="checkFormItemVisible(formItem, '0', '3')"
          :is-link="!formItem.inputvalue ? true : false"
          @click="showPopup(formItem, 'radio', formIndex)">
          <span slot="title" :class="{'van-cell--required' : formItem.confirmation == '1'}">
            {{ formItem.fromname }}
          </span>
          <span slot="default">
            {{ !formItem.inputvalue ? '请选择' : formItem.inputvalue }}
            <van-icon class="clear-button" size="16px" v-if="!!formItem.inputvalue" name="clear" color="#cacaca" @click.stop="clearValue(formItem, 'text')"/>
          </span>
        </van-cell>
        <!-- 假期类型 --> 
        <template v-if="checkFormItemVisible(formItem, '9', '1')">
          <van-cell
            :is-link="!formItem.inputvalue ? true : false"
            @click="showPopup(formItem, 'newpicker', formIndex)">
            <span slot="title" :class="{'van-cell--required' : formItem.confirmation == '1'}">
              {{ formItem.fromname }}
            </span>
            <span slot="default">
              {{ !formItem.inputvalue ? '请选择' : $common.returnVacationName(formItem.inputvalue) }}
              <van-icon class="clear-button" size="16px" v-if="!!formItem.inputvalue" name="clear" color="#cacaca" @click.stop="clearValue(formItem, 'text')"/>
            </span>
          </van-cell>
          <div class="checked-list" v-if="formItem.inputvalue">
            <span class="checked-item people" >{{vacationLabel}}</span>
          </div>
        </template>
        <!-- 请假开始天数 -->
        <van-cell
          v-if="checkFormItemVisible(formItem, '10', '1')"
          :is-link="!formItem.inputvalue ? true : false"
          title-style="max-width: 45%"
          @click="showPopup(formItem, 'newDate', formIndex)">
          <span slot="title" :class="{'van-cell--required' : formItem.confirmation == '1'}">
            {{ formItem.fromname }}
          </span>
          <span slot="default">
            {{ !formItem.inputvalue ? '请选择' : formItem.inputvalue }}
            <van-icon class="clear-button" size="16px" v-if="!!formItem.inputvalue" name="clear" color="#cacaca" @click.stop="clearValue(formItem, 'text')"/>
          </span>
        </van-cell>
        <!-- 请假结束天数 -->
        <van-cell
          v-if="checkFormItemVisible(formItem, '11', '1')"
          :is-link="!formItem.inputvalue ? true : false"
          title-style="max-width: 45%"
          @click="showPopup(formItem, 'newDate', formIndex)">
          <span slot="title" :class="{'van-cell--required' : formItem.confirmation == '1'}">
            {{ formItem.fromname }}
          </span>
          <span slot="default">
            {{ !formItem.inputvalue ? '请选择' : formItem.inputvalue }}
            <van-icon class="clear-button" size="16px" v-if="!!formItem.inputvalue" name="clear" color="#cacaca" @click.stop="clearValue(formItem, 'text')"/>
          </span>
        </van-cell>
        <!-- 单选（异步查询数据）(实际对应 宏控件) -->
        <van-cell
          v-if="checkFormItemVisible(formItem, '7')"
          :is-link="!formItem.inputvalue ? false : true"
          @click="showPopup(formItem, 'radioSync', formIndex)">
          <span slot="title" :class="{'van-cell--required' : formItem.confirmation == '1'}">
            {{ formItem.fromname }}
          </span>
          <span slot="default">
            {{ !formItem.inputvalue ? '请选择' : `${formItem.inputvalue}` }}
            <van-icon class="clear-button" size="16px" v-if="!!formItem.inputvalue" name="clear" color="#cacaca" @click.stop="clearValue(formItem, 'text')"/>
          </span>
        </van-cell>
        <!-- 单选（异步查询数据）(实际对应 第三方数据选择) -->
        <van-cell
          v-if="checkFormItemVisible(formItem, '', '', true)"
          :is-link="formItem.inputvalue == ''"
          @click="showPopup(formItem, 'third', formIndex)">
          <span slot="title" :class="{'van-cell--required' : formItem.confirmation == '1'}">
            {{ formItem.fromname }}
          </span>
          <span slot="default">
            {{ !formItem.inputvalue ? '请选择' : `${formItem.inputvalue}` }}
            <van-icon class="clear-button" size="16px" v-if="!!formItem.inputvalue" name="clear" color="#cacaca" @click.stop="clearValue(formItem, 'text')"/>
          </span>
        </van-cell>
        <!-- 多选 -->
        <template v-if="checkFormItemVisible(formItem, '0', '4')">
          <van-cell
            :value="formItem.inputvalue.length > 0 ? '': '请选择'"
            is-link
            @click="showPopup(formItem, 'checkbox', formIndex)">
            <span slot="title" :class="{'van-cell--required' : formItem.confirmation == '1'}">
              {{ formItem.fromname }}
            </span>
          </van-cell>
          <div class="checked-list">
            <span class="checked-item" v-for="(checked, index) in formItem.inputvalue" :key="`${index}checkbox选中`" @click="deleteCheckbox(formItem, formIndex, index)">{{ checked }} <van-icon name="clear"></van-icon></span>
          </div>
        </template>
        <!-- 多选（异步查询数据）(实际对应 关联表单) -->
        <template v-if="checkFormItemVisible(formItem, '8', '0')">
          <van-cell
            :value="formItem.inputvalue.length > 0 ? '': '请选择'"
            is-link
            @click="showPopup(formItem, 'checkboxSync', formIndex)">
            <span slot="title" :class="{'van-cell--required' : formItem.confirmation == '1'}">
              {{ formItem.fromname }}
            </span>
          </van-cell>
          <div class="checked-list" v-if="formItem.inputvalue.length > 0">
            <span class="checked-item is-link" v-for="(checked, index) in formItem.inputvalue" @click.stop="goToApproval(formItem, formIndex, index)">{{ checked.title }} <van-icon name="clear" @click.stop="deleteCheckbox(formItem, formIndex, index)"></van-icon></span>
          </div>
        </template>

        <!-- 下拉 --> 
        <van-cell
          v-if="checkFormItemVisible(formItem, '0', '5')"
          :is-link="!formItem.inputvalue ? true : false"
          @click="showPopup(formItem, 'picker', formIndex)">
          <span slot="title" :class="{'van-cell--required' : formItem.confirmation == '1'}">
            {{ formItem.fromname }}
          </span>
          <span slot="default">
            {{ !formItem.inputvalue ? '请选择' : formItem.inputvalue }}
            <van-icon class="clear-button" size="16px" v-if="!!formItem.inputvalue" name="clear" color="#cacaca" @click.stop="clearValue(formItem, 'text')"/>
          </span>
        </van-cell>
        <!-- 基础表单 -->
        
        <!-- 高级表单 -->
        <!-- 图片 -->
        <div class="custom-cell less-padding" v-if="checkFormItemVisible(formItem, '1')">
          <div class="cell-title" :class="{'van-cell--required' : formItem.confirmation == '1'}">{{ formItem.fromname }}</div>
          <div class='preview-wrap'>
            <div class="preview-item-img" v-for="(img, imgIndex) in formItem.inputvalue">
              <img :src="getFullUrl(img)" @click="previewImg(imgIndex, formItem.inputvalue)">
              <van-icon class="close-button" name="clear" @click="deleteItem(formItem, imgIndex)"></van-icon>
            </div>
            <van-uploader multiple :after-read="(file) => afterRead(file, 'img', formItem)"/>
          </div>
        </div>
        <!-- 附件 -->
        <div class="custom-cell less-padding" v-if="checkFormItemVisible(formItem, '2')">
          <div class="cell-title" :class="{'van-cell--required' : formItem.confirmation == '1'}">{{ formItem.fromname }}</div>
          <div class='preview-wrap'>
            <div class="preview-item-file" v-for="(file, fileIndex) in formItem.inputvalue">
              <span class="van-ellipsis">
                <img :src="$common.fileIcon(fileName(file, 'type'))">
                <span class="file-name" @click="previewFile(file)">{{ fileName(file, 'fullName') }}</span>
              </span>
              <van-icon class="close-button" name="clear" @click="deleteItem(formItem, fileIndex)"></van-icon>
            </div>
            <van-uploader multiple :before-read="beforeRead" :after-read="(file) => afterRead(file, 'file', formItem)" accept="*"/>
          </div>
        </div>
        <!-- 日期 -->
        <van-cell
          v-if="checkFormItemVisible(formItem, '3')"
          :is-link="!formItem.inputvalue ? true : false"
          @click="showPopup(formItem, 'date', formIndex)">
          <span slot="title" :class="{'van-cell--required' : formItem.confirmation == '1'}">
            {{ formItem.fromname }}
          </span>
          <span slot="default">
            {{ !formItem.inputvalue ? '请选择' : formItem.inputvalue }}
            <van-icon class="clear-button" size="16px" v-if="!!formItem.inputvalue" name="clear" color="#cacaca" @click.stop="clearValue(formItem, 'text')"/>
          </span>
        </van-cell>
        <!-- 部门 -->
        <van-cell
          v-if="checkFormItemVisible(formItem, '4')"
          :is-link="!formItem.inputvalue ? true : false"
          @click="showPopup(formItem, 'department', formIndex)">
          <span slot="title" :class="{'van-cell--required' : formItem.confirmation == '1'}">
            {{ formItem.fromname }}
          </span>
          <span slot="default">
            {{ !formItem.inputvalue ? '请选择' : formItem.inputvalue }}
            <van-icon class="clear-button" size="16px" v-if="!!formItem.inputvalue" name="clear" color="#cacaca" @click.stop="clearValue(formItem, 'text')"/>
          </span>
        </van-cell>
        <!-- 成员(数据inputvalue将会被处理为数组, 后续提交时还原) -->
        <template v-if="checkFormItemVisible(formItem, '5')">
          <van-cell
            value="请选择"
            :is-link="true"
            @click="showPopup(formItem, 'people', formIndex)">
            <span slot="title" :class="{'van-cell--required' : formItem.confirmation == '1'}">
              {{ formItem.fromname }}
            </span>
          </van-cell>
          <div class="checked-list" v-if="formItem.inputvalue.length > 0">
            <span class="checked-item people" v-for="(checked, index) in formItem.inputvalue" @click="deleteCheckbox(formItem, formIndex, index)">{{ checked }} <van-icon name="clear"></van-icon></span>
          </div>
        </template>
        <!-- 高级表单 -->
      </van-cell-group>
    </form>
    <!-- 表格(附带金额计算 行统计等) -->
    <template v-if="tableData" v-for="(table, tableIndex) in tableData">
      <div class="table-wrap">
        <div class="table-col" v-for="(col, colIndex) in table.table">
          <label class="table-header van-ellipsis">{{ col.fromname }}</label>
          <div class="table-input-wrap" v-for="(colItem, colItemIndex) in col.inputvalue"> 
            <template>
              <input v-if="col.product != '1'" :disabled="col.product == '3'" type="text" v-model="col.inputvalue[colItemIndex]" @blur="reCalculate(tableIndex, col, colIndex, colItem, colItemIndex)">
              <input v-else :disabled="col.product == '3'" type="number" pattern="\d*" v-model="col.inputvalue[colItemIndex]" @blur="reCalculate(tableIndex, col, colIndex, colItem, colItemIndex)">
            </template>
          </div>
        </div>
      </div>
      <div class="total-calc" v-if="table.dbtype == '3'">总金额: {{ returnTotal(table) }}</div>
    </template>

    <!-- popup内  单选, 多选, 下拉 -->
    <van-popup v-model="popupVisible" position="bottom" @click-overlay="closePopup">
      <div class="popup-wrap" v-if="tempType != 'date'">
        <div class="tool-wrap">
          <span @click="confirm(false)">取消</span>
          <span  class="active" @click="confirm(true)">确定</span>
        </div>
        <div class="popup-body" ref="popupBody" @scroll="popupScorlling">
          <!-- 单选 -->
          <van-radio-group v-if="tempType == 'radio'" v-model="tempPopupTarget" ref="radio">
            <van-radio v-for="item in tempPopupField" :name="item">{{ item }}</van-radio>
          </van-radio-group>
          <!-- 多选 -->
          <van-checkbox-group v-if="tempType == 'checkbox' && tempPopupField.length > 0" ref="checkbox" v-model="tempPopupTarget">
            <van-checkbox shape="square" v-for="item in tempPopupField" :name="item" :key="item">{{ item }}</van-checkbox>
          </van-checkbox-group>
          <!-- 多选(备选项异步查询 - 关联表单) -->
          <div class="custom-checkbox" v-if="tempType == 'checkboxSync'" ref="checkboxSync">
            <div v-for="item in tempPopupField"  :class="{'checked': item.checked}" @click="itemClicked(item, 'checkbox')">
              <van-icon name="checked" size="20" v-if="item.checked"/>
              <van-icon name="circle" size="20" color="#e5e5e5" v-else/>
            {{ item.title || '默认标题' }}</div>
          </div>
          <!-- 单选(备选项异步查询 - 宏控件) -->
          <div class="custom-checkbox" v-if="tempType == 'radioSync'" ref="radioSync">
            <van-radio-group v-model="tempPopupTarget" ref="radio">
              <van-radio v-for="item in tempPopupField" :name="item">{{ item }}</van-radio>
            </van-radio-group>
            <!-- <div v-for="item in tempPopupField"  :class="{'checked': item.checked}" @click="itemClicked(item, 'radio')"><van-icon name="checked" v-if="item.checked"/>{{ item }}</div> -->
          </div>
          <!-- 单选(备选项异步查询 - 第三方数据) -->
          <van-search
            v-if="tempType == 'third'"
            v-model="searchValue"
            placeholder="请输入搜索关键词"
            show-action>
            <div slot="action" @click="onThirdSearch">搜索</div>
          </van-search>
          <div class="custom-checkbox with-button" v-if="tempType == 'third'" ref="radioSync">
            <van-radio-group v-model="tempPopupTarget" ref="radio">
              <van-radio v-for="item in tempPopupField" :name="item[1]" @click="tempThird = item">{{ item[1] }}</van-radio>
              <van-button v-if="isMore" size="large" @click="getMoreThirdData">查看更多</van-button>
              <van-button v-else disabled size="large">没有更多了</van-button>
            </van-radio-group>
            <!-- <div v-for="item in tempPopupField"  :class="{'checked': item.checked}" @click="itemClicked(item, 'radio')"><van-icon name="checked" v-if="item.checked"/>{{ item }}</div> -->
          </div>
          <!-- <van-checkbox-group v-if="tempType == 'checkboxSync'" ref="checkboxSync" >
            <van-checkbox v-model="item.checked" shape="square" v-for="item in tempPopupField" :name="item" :key="item.id">{{ item.title }}</van-checkbox>
          </van-checkbox-group> -->
          <!-- 下拉(带搜索功能) -->
          <form v-if="tempType == 'picker'" action="/">
            <van-search
              v-model="searchValue"
              placeholder="请输入搜索关键词"
              show-action>
              <div slot="action" @click="onSearch">搜索</div>
          </van-search>
          </form>
          <van-picker v-if="tempType == 'picker' && resultField.length > 0"  ref="picker" :columns="resultField" :swipe-duration="300"/>
          <div v-else-if="tempType == 'picker'" class="no-data-picker">暂无选项</div>
          <!-- 假期类型 -->
          <van-picker v-if="tempType == 'newpicker' && resultField.length > 0"  ref="npicker" 
            :columns="resultField" value-key="name" :swipe-duration="300"/>
          <!-- 部门（单选） -->
          <van-radio-group class="department-choose-block" v-if="tempType == 'department' && departmentList.length > 0" v-model="tempPopupTarget" ref="radio">
            <div class="tree-item-wrap" v-for="item in departmentList">
              <van-radio class="fluid-item" label-position="left"  :name="item.name">
                <div class="tree-placeholder" v-for="i in item.deep">&nbsp;</div>
                <img v-if="item.deep > 0" class="tree-line" src="../assets/components/tree_line.png">
                <img class="tree-block" src="../assets/components/tree_block.png">
                {{ item.name }}
              </van-radio>
            </div>
          </van-radio-group>
          <!-- 人员（单选 -> 已改为多选） -->
          <!-- <choose-people
            v-if="tempType == 'people' && popupVisible"
            ref="choosePeople"
            :items="departmentTree"
            :checked.sync="tempPopupTarget" :isName="true">
          </choose-people> -->
          <side-choose v-if="tempType == 'people' && popupVisible" ref="sideChoose" :items.sync="departmentTree" :default.sync="tempPopupTarget" maxHeight="50vh"></side-choose>
          <div class="no-more-text" v-if="(tempType == 'radioSync' || tempType == 'checkboxSync') && noMore">没有更多了~</div>
        </div>
        <!-- 新请假时间 -->
        <new-time 
        v-if="tempType == 'newDate' && popupVisible"
        ref="newTimePicker"
        :values="newTimeData" :limit="limits"></new-time>
      </div>
      <!-- 时间选择 -->
      <van-datetime-picker
        v-else-if="tempType == 'date'"
        ref="date"
        @confirm="(value) => { confirm(true) }"
        @cancel="confirm(false)"
        v-model="tempDate"
        type="datetime"
        :swipe-duration="300"
        :min-date="minDate"/>
      <!-- <van-area
        v-else
        v-model="tempArea"
        :swipe-duration="300"
        @confirm="(value) => { confirm(true) }"
        @cancel="confirm(false)"
        :area-list="areaList"/> -->

    </van-popup>
  </div>
</template>

<script>
  import tree from '@/components/tree/TreeMenu.vue'
  import choosePeople from '@/components/ChoosePeople.vue'
  import sideChoose from '@/components/SideChoose.vue'
  import newTime from '@/components/NewTime.vue'
  import { ImagePreview } from "vant";
  export default {
    components: {
      tree,
      choosePeople,
      sideChoose,
      newTime,
    },
    props: {
      form: { // 原始数据
        type: Array,
        required: true,
        default: () => {
          return []
        }
      },
      table: {
        type: Array,
        required: true,
        default: () => {
          return []
        }
      },
      workObject: {
        type: Object,
        default: () => {
          return {}
        }
      }
    },
    watch: {
      'form': {
        handler(newV, oldV) {
          this.initFormData(newV, 'formData')

          // 如果假期类型有初始值，执行方法
          newV.forEach((item,index) => {
            if (item.inputtype == '9') {
              if (item.inputvalue) {
                this.getVacationInfo(item.inputvalue, false)
              }
            }
          })
        },
        deep: true
      },
      'table': {
        handler(newV, oldV) {
          this.initFormData(newV, 'tableData')
        },
        deep: true
      },
      'searchValue': {
        handler(newV, oldV) {
          if(newV == '') { // 被关键字清空 还原列表项
            this.resultField = this.$common.deepCopy(this.tempPopupField)
          }
        },
        deep: true
      },
      'workObject': {
        handler(newV, oldV) {
          console.log(newV)
        },
        deep: true
      },
      // 监听开始时间和结束时间  反馈天数
      'timeObj': {
        handler(newV, oldV) {
          let s_time = newV.startTime.split(" ")[0]
          let e_time = newV.endTime.split(" ")[0]
          let s_time_chose = newV.startTime.split(" ")[1]
          let e_time_chose = newV.endTime.split(" ")[1]
          let cut = 0

          if (new Date(s_time).valueOf() > new Date(e_time).valueOf()) {
            this.$toast.fail("结束时间不能小于开始时间")
            return;
          }

          if (s_time && e_time) {
            let day = 0;
            // 年份相同
            if (s_time.split("-")[0] == e_time.split("-")[0]) {
              // 得到天数
              day = this.$common.getWorkDayCount('cn', s_time, e_time, this.delFlag, this.holiday, this.weekOff)
            } else {
              // 年份不相同
              // 获取开始年份到12月31号的假期 以及 天数
              if (!this.delFlag) {
                this.holidayAndWeekoff(s_time.split("-")[0])
              }
              let s_day = this.$common.getWorkDayCount('cn', s_time, s_time.split("-")[0] + '-12-31', this.delFlag, this.holiday, this.weekOff)
              // 获取1月1日到结束年份日期的假期 以及 天数
              if (!this.delFlag) {
                this.holidayAndWeekoff(e_time.split("-")[0])
              }
              let e_day = this.$common.getWorkDayCount('cn', e_time.split("-")[0] + '-1-1', e_time, this.delFlag, this.holiday, this.weekOff)
              // 将两个天数加起来
              day = s_day + e_day
            }
            // 扣除天数
            if (s_time_chose == '下午') {
              cut += 0.5
            }
            if (e_time_chose == '上午') {
              cut += 0.5
            }
            day = day - cut
            if (this.single_limit && this.single_limit < day) {
              this.$toast.fail("单次请假天数限制" + this.single_limit + '天，请重新选择')
              return;
            }
            // 赋值
            this.formData.forEach(item => {
              if (item.fromname == '请假天数') {
                  item.inputvalue = day
                }
            })
          }
        },
        deep: true
      },
      // 'keyboardVisible': {
      //   handler(newV, oldV) {
      //     if(newV == true) {
      //       this.moveDistance = 0
      //     }
      //   }
      // },
      // 'moveDistance': {
      //   handler(newV, oldV) {
      //     if(newV >= 70) {
      //       this.keyboardVisible = false
      //     }
      //   }
      // },
    },
    data() {
      return {
        searchValue: '', // 搜索关键字
        moveDistance: 0, // 滑动的距离
        keyboardVisible: false, // 数字键盘
        numberInputValue: '', // 数字输入

        formData: [],
        tableData: [],

        departmentList: [], //部门(列表)
        departmentTree: [], //部门(树)

        popupVisible: false,
        
        // 为popup 创建的缓存数据
        minDate: new Date('1950-01-01'),
        tempDate: new Date(), // 当前选择器的时间 初始为空不渲染
        tempArea: null, // 当前省市区选择器的值 初始为空不渲染
        tempType: 'radio', // 当前操作的控件类型 radio 单选 checkbox 多选 picker 下拉 date 日期 department 部门 people 人员
        tempScrolling: true, // ios橡皮筋效果节流变量 , 将在打开popup时还原为true , 为false时不进行进一步操作
        tempPage:  1, // 分页
        noMore: false, // 是否还有更多
        tempMagnificent: '', //查询关联表的内容
        tempDo: '', // 当前异步查询的类型
        tempIndex: -1, // 当前操作的表单序列, 用以操作数据
        tempPopupTarget: '', //当前操作的popup中的选中内容 仅在点击确定时进行替换真实值
        tempPopupField: [], //当前 操作的内容字段名, 单选多选的选择内容 (取消时, 进行还原)
        tempThird: [], // 最后一次选中第三方数据, 每次点击radio更新, 打开弹窗时还原为空数组[]
        finished: false, // 异步查询备选项的状态
        isMore: true, // 异步查询第三方数据的是否有更多数据判断, 打开弹窗重置为true
        resultField: [], // 为避免覆盖数据 搜索结果需要单独存储 在picker中直接调用本数据

        newTimeData: '',
        limits: '0.5',    
        vacationLabel: '',  //假期类型的提示语
        delFlag: false,      //是否删除节假日,默认false
        timeObj: {
          startTime: '',
          endTime: '',
        },
        holiday: [],
        weekOff: [],
        single_limit: ''    //单次请假天数
      }
    },
    created() {
      // this.$toast.loading({
      //   message: '表单加载中...',
      //   forbidClick: true
      // })
      this.getDepartment('workclass', 'departmentList')
      this.getDepartment('meeting', 'departmentTree')
      this.initFormData(this.form, 'formData')
      this.initFormData(this.table, 'tableData')

      // 获取节假日
      this.holidayAndWeekoff()
    },
    mounted() {
      window.f = this
    },
    methods: {
      /**
       * 获取节假日
       * @return {[type]} [description]
       */
      holidayAndWeekoff(year) {
        if (!year) {
          year = new Date().getFullYear()
        }
        let config = {
          method: 'POST',
          data: {
            time: year
          },
          url: `${this.$common.basePath}/aatp5/public/index.php/salary/salary/time`,
        }
        this.$axios(config).then(res => {
          if (res.data.holiday.length > 0) {
            this.holiday = res.data.holiday
            this.weekOff = res.data.weekendsoff
          } else {
            // this.$toast.fail('节假日数据还没生成，相关功能无法使用')
          }
        }).catch(err => {
        })
      },
      /**
       * 计算总和列的值 得出总值
       * @param  {Object} tableItem 表格对象(具体数据为 tableItem.table)
       * @return {Number}           计算总额结果
       */
      returnTotal(tableItem) {
        let result = null
        let target = []
        tableItem.table.forEach(item => {
          if(item.product == '3') {
            target = item.inputvalue
          }
        })
        result = target.reduce((total, curr) => {
          return ( parseInt(total) || 0) + ( parseInt(curr) || 0)
        }, 0)
        return parseInt(result)
      },
      /**
       * 编辑结束 动态计算 将值写入行末尾
       * @param  {Number} tableIndex   表格的序列
       * @param  {Object} col          列 List ,包含inputvalue
       * @param  {Number} colIndex     列的序列
       * @param  {String} colItem      列, 行的值
       * @param  {Number} colItemIndex 行的序列
       */
      reCalculate(tableIndex, col, colIndex, colItem, colItemIndex) {
        let multi = []
        let targetIndex = -1
        
        // console.log(this.tableData[tableIndex].table[colIndex].inputvalue[colItemIndex])
        this.tableData[tableIndex].table.forEach((item, index) => {
          if(item.product == '1') { //行乘积运算
            multi.push(item.inputvalue[colItemIndex] || 0)
          }
          if(item.product == '3') { ////行求和运算 寻找需要替换数据的目标
            targetIndex = index
          }
          //列求和运算
          if(item.numtype == '1') {
            console.log(this.tableData)
            // const length = this.formData.length
            // for(let i = 0 ; i < length;i++) {
            //   if(this.formData[i].inputname === '')
                
            // }
            // // this.formData.forEach(formDataItem => {
            // //   console.log(formDataItem)
            // //   formDataItem[item.numinput] = 1
            // // })
            // item.inputvalue.forEach(inputItem => {
                
            //     // console.log(this.formData)
            // })
          }

        })
        let result = 1 

        multi.forEach(item => {
          result = result * parseInt(item)
        })
        this.$nextTick(_ => {
          if(targetIndex != -1) {
            this.tableData[tableIndex].table[targetIndex].inputvalue[colItemIndex] = `${result}`
          }
          this.tableData = this.$common.deepCopy(this.tableData) // 强制刷新数据
        })
      },
      /**
       * 点击自定义列表项 将其选中
       * @param  {Object} item 所点击的列表对象
       */
      itemClicked(item) {
        !item.checked ? item.checked = true : item.checked = false
        this.tempPopupField = this.$common.deepCopy(this.tempPopupField) // force Reload
      },
      /**
       * 处理文件名称
       * @param  {String} url  文件地址(包含文件名, 文件类型)
       * @param  {String} type 截取类型 name 只需要名称 type 相只需要文件类型 fullName 返回完整文件名
       * @return {String}      截取后的名称
       */
      fileName(url, type) {
        let fullName   = !url.split('@daxsdfcsgr6time666@')[1] ? url : url.split('@daxsdfcsgr6time666@')[1]
        let pointCount = fullName.split('.').length
        let fileType   = fullName.split('.')[pointCount - 1]
        switch(type){
          case 'name':
            return fullName.split('.', pointCount - 1).join('.');
          case 'type':
            return fileType;
          case 'fullName':
          default:
            return fullName;
        }
      },
      /**
       * 获取备选项数据
       * @param  {String} type   根据类型获取备选项数据(人员/部门), 两种有不同的数据结构
       * @param  {String} target 数据目标key
       */
      getDepartment(type, target) {
        this.$axios.post(`${this.$common.basePath}${type}.php`, {
          do: 'department'
        }).then(res => {
          this[target] = res.data
          // 处理树形数据
          if(type == 'meeting') {
            let treeData = this.$common.deepCopy(res.data)
            for (var i = 0; i < treeData.length; i++) {
              treeData[i].text = treeData[i].name
              for (var j = 0; j < treeData[i].children.length; j++) {
                (treeData[i].children)[j].text = (treeData[i].children)[j].name;
                (treeData[i].children)[j].choosed = false
              }
            }
            this[target] = treeData
          }
        }).catch(err => { this.$toast.error('获取数据错误 相关功能无法使用')})
      },
      /**
       * 由原数据初始化
       * @param  {Object} data   源数据
       * @param  {String} target 初始化目标key
       */
      initFormData(data, target) {
        this[target] = this.$common.deepCopy(data)
        if(target == 'formData') {
          this.$nextTick(_ => {
            this[target].forEach((item, index) => {
              if(item.inputtype == '5' && item.inputtype1 == '1') {
                item.inputvalue = !item.inputvalue ? [] : item.inputvalue.split(',')
              }
            })
          })
        }
      },
      /**
       * (数字键盘)开始输入 根据输入框位置进行顶部收缩微调
       * @param  {Object} formItem  表单对象
       * @param  {Number} formIndex 表单序列
       * @param  {Object} e         点击事件触发对象
       * @param  {String} dbtype    判断是否是数字输入框类型
       */
      showNumberKeyboard(formItem, formIndex, e, dbtype) { // 当键盘操作元素位置在过于下方时 调整页面位置 使其能正常显示
        if(dbtype == '3') { // 金额型 才使用此方法
          if(window.innerHeight - e.clientY < 326) { //将被遮挡
            this.$refs.zoomzeForm.style.margin = `-${ 326 - (window.innerHeight - e.clientY)}px 0 0 0`
          }
          if(formItem.dbtype == '3') {
            this.tempIndex = formIndex
            this.keyboardVisible = true
          }
        }
      },
      /**
       * (数字键盘)输入结束 关闭键盘 取消顶部收缩距离
       * @param  {Number} formIndex 当前的form序列
       */
      afterInput(formIndex) {
        if(formIndex >= 0) {
          this.keyboardVisible = false
          this.numberInputValue = ''
          let int = parseFloat(this.formData[this.tempIndex].inputvalue)
          this.formData[this.tempIndex].inputvalue = int.toString().match(/^\d*(\.?\d{0,2})/g)[0] || ''
          this.$refs.zoomzeForm.style.margin = '0'
        }
      },
      /**
       * 阻止 键盘内的滑动
       * @param  {[type]} e [description]
       * @return {[type]}   [description]
       */
      touchMoving(e) {
        e.preventDefault()
      },
      /**
       * 处理表单渲染逻辑
       * @param  {[type]} formItem 当前表单项formItem
       * @param  {String} type     表单类型字段
       * @param  {String} type1    表单类型字段1
       * @return {Boolean}         是否渲染该表单项
       */
      checkFormItemVisible(formItem, type, type1, isThrid) {
        if (formItem.third_party && formItem.third_type) {
          return formItem.third_party && formItem.third_type && isThrid
        } else {
          if(type == '0') {
            return (formItem.inputtype == type && formItem.inputtype1 == type1)
          } else {
            return formItem.inputtype == type
          }
        }
      },
      /**
       * 删除多选(异步查多选通用方法)
       * @param  {Object} formItem  当前表单项formItem
       * @param  {Number} formIndex 当前表单formIndex
       * @param  {Number} index     删除的checkbox的index
       */
      deleteCheckbox(formItem, formIndex, index) {
        this.formData[formIndex].inputvalue.splice(index, 1)
      },
      /**
       * 跳转至详情
       * @param  {[type]} formItem  [description]
       * @param  {[type]} formIndex [description]
       * @param  {[type]} index     [description]
       * @return {[type]}           [description]
       */
      goToApproval(formItem, formIndex, index) {
        let url = ''
        if(window.location.href.indexOf('/h5/#/') != -1) {
          url = `${window.location.origin}/h5/#/approvalInfo?workid=${formItem.inputvalue[index].id}&type=2&close=close&userid=${this.$store.state.userId}&token=${this.$store.state.token}`
        } else {
          `${window.location.origin}/approvalInfo?workid=${formItem.inputvalue[index].id}&type=2&close=close&userid=${this.$store.state.userId}&token=${this.$store.state.token}`
        }
        this.$bridge.callHandler('openNewView', {
          url: url})
      },
      beforeRead(file) {
        let flag = true
        if(file.type) { // 单个文件
          if(file.size > 20*1024*1024) {
            this.$dialog.alert(`{file.name} - 文件大于20MB`)
            flag = false
          }
        } else { // 多文件 多次调用
          file.forEach(fileItem => {
            if(fileItem.size > 20*1024*1024) {
              this.$dialog.alert({message: `${fileItem.name} - 文件大于20MB , 上传已终止!`})
              flag = false
            }
          })
        }
        return flag
      },
      /**
       * 成功读取文件后 进行上传
       * @param  {File}   file     文件
       * @param  {String} type     类型 (预留内容)
       * @param  {Object} formItem 表单formItem
       */
      afterRead(file, type, formItem) {
        if(file.hasOwnProperty('content')) { // 单个文件
          this.uploadImg(file.file, formItem)
        } else { // 多文件 多次调用
          file.forEach(fileItem => {
            this.uploadImg(fileItem.file, formItem)
          })
        }        
      },
      /**
       * 上传文件
       * @param  {File}   file     文件
       * @param  {Object} formItem 表单formItem
       */
      uploadImg(file, formItem) {
        this.$bridge.callHandler('navKeepView')
        let formData = new FormData()
        formData.append('do', 'file')
        formData.append('file', file)

        self.$toast({
          duration: 0,
          forbidClick: true,
          className: 'loading-toast',
          icon: require('../assets/loading.gif'),
        })
        let config = {
          headers: { //添加请求头
            'Content-Type': 'multipart/form-data'
          },
          url: `${this.$common.basePath}login.php`,
          data: formData,
          method: 'POST'
        }
        this.$axios(config).then(res => {
          this.$bridge.callHandler('cancelNavKeepView')          
          formItem.inputvalue.push(res.data.url)
          this.$nextTick(_ => {
            this.$toast.clear()
          })
        }).catch(err => {
          this.$bridge.callHandler('cancelNavKeepView')
          this.$toast({
            icon: 'cross',
            message: err.msg ? err.msg : '上传失败!'
          })
        })
      },
      /**
       * 点击预览图片
       * @param  {Number} index   当前点击序列
       * @param  {Array}  imgList 当前的图片列表
       */
      previewImg(index, imgList) {
        let imgs = imgList.map(item => {
          return `${this.$common.filePath}${item}`
        })
        ImagePreview({images: imgs, startPosition: index})
      },
      /**
       * 点击预览附件
       * @param  {[type]} item [description]
       * @return {[type]}      [description]
       */
      previewFile(item) {
        this.$bridge.callHandler('showPreview', {
          url: `${this.$common.filePath}${item}`,
          fileName:  this.fileName(item, 'fullName') || item
        })
        window.open(`${this.$common.filePath}${item}?filename=${this.fileName(item, 'fullName')}`)
      },
      /**
       * 返回文件完整url
       * @param  {String} url 相对地址
       */
      getFullUrl(url) {
        return `${this.$common.filePath}${url}`
      },
      /**
       * 删除图片/附件
       * @param  {Object} formItem 当前formItem
       * @param  {Number} imgIndex 对应图片序列
       */
      deleteItem(formItem, imgIndex) {
        formItem.inputvalue.splice(imgIndex, 1)
      },
      /**
       * 打开popup 根据field渲染内容与绑定数据
       * @param  {Object} formItem  表单项
       * @param  {String} type      打开弹窗后的类型
       * @param  {String} formIndex 当前formIndex 用于记录
       */
      showPopup(formItem, type, formIndex) {
        
        this.tempType        = type
        //-----------

        this.resultField     = formItem.inputvaluenum // 同时保存关键字对应的列表项
        this.tempPopupTarget = formItem.inputvalue

        this.isMore          = true
        this.tempThird       = [] // 还原第三方的选中值
        this.searchValue     = '' // 还原初始关键字
        this.tempIndex       = formIndex
        if(type == 'date') { // date对象需要单独赋予初值
          this.tempDate = !formItem.inputvalue ? new Date() : new Date(formItem.inputvalue)
        } else if (type == 'newDate') {
          this.newTimeData = !formItem.inputvalue ? this.$common.convertDate(new Date().valueOf(), 'Y-M-D') + ' ' : formItem.inputvalue
        }
        //------------
        this.tempPage = 1 // 打开popup后重新 查询第一页
        this.tempPopupField = []
        this.tempScrolling = true
        if(type == 'checkboxSync') { // 查询异步(多选 - 关联表单)
          this.tempDo = 'relation'
          this.tempMagnificent = formItem.magnificent
          this.getList()
        } else if (type == 'radioSync') {// 查询异步(单选 - 宏控件)
          this.tempDo = 'macro'
          this.tempMagnificent = formItem.magnificent
          this.getList()
        } else if(type == 'third') { // 查询异步(单选 - 第三方数据)
          this.tempDo = ''
          this.getList()
        } else { // 通常情况直接调用inputvaluenum中的备选项
          this.$bridge.callHandler('navKeepView')
          this.tempPopupField  = formItem.inputvaluenum
          this.popupVisible = true
        }

        this.$nextTick(_ => {
          if(type == 'picker' && this.$refs.picker)
            this.$refs.picker.setValues([this.formData[this.tempIndex].inputvalue]);
        })
      },
      /**
       * 点蒙层关闭popup
       * @return {[type]} [description]
       */
      closePopup() {
        this.$bridge.callHandler('cancelNavKeepView')
      },
      /**
       * 清空选择的内容
       * @param  {[type]} formItem [description]
       * @param  {[type]} type     [description]
       * @return {[type]}          [description]
       */
      clearValue(formItem, type) {
        if(type != 'array') {
          formItem.inputvalue = ''
        } else {
          formItem.inputvalue = []
        }
      },
      /**
       * 获取假期类型的信息
       * @param  {[type]} jsonid 类型id
       * @param  {[type]} flag   是否要清空开始和结束时间的值
       * @return {[type]}        [description]
       */
      getVacationInfo(jsonid , flag) {
        let config = {
          url: `${this.$common.basePath}/aatp5/public/index.php/vacation/vacation/leave_settings`,
          method: 'post',
          data: {
            type: jsonid,
            uid: this.$store.state.userId
          }
        }
        this.$axios(config).then(res => {
          let condition = res.data
          if(!condition) {
            this.$toast.fail('该假期你不能申请')
            this.formData.forEach(item => {
              if(item.inputtype == '9'||item.inputtype == '10' || item.inputtype == '11') {
                item.inputvalue = ''
              }
              if (item.fromname == '请假天数') {
                item.inputvalue = ''
                item.readonly = 'readonly'
              }
              this.timeObj = {
                startTime : '',
                endTime : ''
              }
            })
          } else {
            let limit = ''
            let msg = ''
            msg = '余额：' + condition.count + '天'
            if (condition.min_limit == '0.5') {
              limit = '最小请假单位' + condition.min_limit + '天';
              this.limits = ''+ condition.min_limit
            } else {
              limit = '最小请假单位1天';
              this.limits = '1'
            }
            if(condition.single_limit) {
              limit = limit + '，单次请假天数限制' + condition.single_limit + '天';
            }
            this.delFlag = condition.is_deduct == 1? true : false  //是否扣去节假日，默认否
            this.single_limit = condition.single_limit  //单次请假天数
            this.vacationLabel = msg + '，' + limit

            if(flag) {
              // 每次切换后都要清空时间，让用户重新选择，以免发生不必要的错误
              this.formData.forEach(item => {
                if(item.inputtype == '10' || item.inputtype == '11' || item.fromname == '请假天数') {
                  item.inputvalue = ''
                }
                if (item.fromname == '请假天数') {
                  item.readonly = 'readonly'
                }
                this.timeObj = {
                  startTime : '',
                  endTime : ''
                }
              })
            }
          }
        }).catch(err => {
          this.$toast.fail('数据错误')
        })
      },
      /**
       * 获取异步备选项数据 并保存在tempPopupField中
       * @param  {String} magnificent 请求数据参数
       */
      getList() {
        let self = this
        
        let config = {
          url: '',
          method: 'POST',
          data: {
            do: '',
            magnificent: this.tempMagnificent,
            page: this.tempPage,
            user_id: this.$store.state.userId
          }
        }
        if(this.tempDo == 'relation') {
          config.data.do = this.tempDo
          config.url = `${self.$common.basePath}workclass.php`
        } else if (this.tempDo == 'macro') {
          config.data.do = this.tempDo
          config.url = `${self.$common.basePath}documentlist.php`
        } else { // 第三方数据查询
          this.formData[this.tempIndex]
          config.data.id = this.formData[this.tempIndex].third_party
          config.data.type = this.formData[this.tempIndex].third_type
          config.data.page = (this.tempPage - 1 < 0 ) ? 0 : this.tempPage - 1
          config.data.name = this.searchValue
          config.data.workid = this.workObject.id
          config.url = `${self.$common.basePath}aatp5/public/index.php/salary/third/kingdee_data`
        }
        if(this.tempScrolling) {
          this.$bridge.callHandler('navKeepView')
          self.$toast({
            duration: 0,
            forbidClick: true,
            className: 'loading-toast',
            icon: require('../assets/loading.gif'),
          })
          self.$axios(config)
          .then(res => { // 将符合条件的数据进行选中
            let data = self.tempType != 'third' ? this.$common.deepCopy(res.data.list) : this.$common.deepCopy(res.data)
            if(data.length == 0) {
              self.isMore = false
            }
            // 多选的情况进行选中, 其余情况直接可选中
            if(this.tempType == 'checkboxSync') {
              data.forEach(item => {
                item.checked = false
                self.tempPopupTarget.forEach(i => {
                  if(i.id == item.id) {
                    item.checked = true
                  }
                })
              })
            }

            self.tempPopupField = self.tempPopupField.concat(data) // concat
            self.popupVisible = true
            

            this.$nextTick(_ => {
              if(self.tempPage == 1) {
                self.$refs.popupBody.scrollTop = 0
              }
              this.$toast.clear()
              if(data.length == 0 && self.tempPage == 1) {
                this.$toast({
                  message: '未查询到相关内容!',
                  icon: 'cross'
                })
              }
              this.noMore = res.data.next == 0 ? true : false
              this.tempScrolling = false
            })
          })
          .catch(err => {
            this.$nextTick(_ => {
              this.$toast({
                message: '未查询到相关内容!',
                icon: 'cross'
              })
              this.tempScrolling = false
            })
          })
        }

      },
      getMoreThirdData() {
        this.tempPage += 1
        this.tempScrolling = true // 为了适应之前的操作逻辑 所添加的额外代码
        this.getList()
      },
      onThirdSearch() {
        this.tempPage = 1
        this.tempScrolling = true // 为了适应之前的操作逻辑 所添加的额外代码
        this.isMore = true
        this.tempPopupField = []
        this.getList()
      },
      /**
       * 分页触底 查询下一页并拼接
       * @param  {[type]} e [description]
       * @return {[type]}   [description]
       */
      popupScorlling(e) {
        if((e.target.scrollTop + this.$refs.popupBody.offsetHeight >= this.$refs[this.tempType].offsetHeight) && this.popupVisible && !this.noMore) {
          this.tempScrolling = true
          this.tempPage += 1
          this.getList()
        }
      },
      /**
       * 点击搜索 过滤选项 存放至resultField
       * @param  {Array} tempPopupField 当前的列表源数据(过滤前)
       */
      onSearch(tempPopupField) {
        let result = this.tempPopupField.filter(item => {
          return item.indexOf(this.searchValue) != -1
        })
        this.resultField = result
      },
      // /**
      //  * date 变化 获取当前datepicker实例
      //  * @param  {Object} e 实例 
      //  */
      // dateChanged(e) {
      //   this.tempDateRef = e
      // },
      // /**
      //  * area 变化 获取当前area实例
      //  * @param  {Object} e 实例 
      //  */
      // dateChanged(e) {
      //   this.tempAreaRef = e
      // },
      /**
       * 确认选择 根据确认取消 将值写入
       * @param  {Boolean} boolean 确认/取消
       */
      confirm(boolean) {
        this.$bridge.callHandler('cancelNavKeepView')
        if(boolean) {
          if(this.tempType == 'picker' && this.resultField.length == 0) {
            this.$toast({
                message: '当前没有选中任何内容',
                icon: 'cross'
              })
            return false
          }
          switch(this.tempType) {
            case 'radio':
            case 'checkbox':
            case 'radioSync':
              this.formData[this.tempIndex].inputvalue = this.tempPopupTarget;
              break;
            case 'third': // 第三方数据的写入情况, 当遇到合同这一特殊项时, 还需要写入别的数据, 根据toa_来进行固定填充
              let target = []
              this.tempPopupField.forEach(item => {
                if(this.tempPopupTarget == item[1]) {
                  target = item
                  return false
                }
              })
              // 数据数组target的成员每一项分别的意义 ['项目编号', '合同名称(无需再赋值)', '无意义', 无意义', '合同总金额', '已付款金额']
              this.formData[this.tempIndex].inputvalue = this.tempPopupTarget;
              this.formData.forEach(item => {
                switch (item.inputname) {
                  case 'toa_2941_20200527155509':
                    item.inputvalue = target[0]
                    break;
                  case 'toa_7386_20200527155400':
                    item.inputvalue = target[4].toString()
                    break;
                  case 'toa_3574_20200527155431':
                    item.inputvalue = target[5].toString()
                    break;
                  case 'toa_2694_20200527155655':
                  if(target[4] >= target[5] && target[5] > 0) { // 付款金额 <= 总金额
                    item.inputvalue = (target[5] / target[4] * 100).toFixed(2)
                  }
                }
              })
              break;
            case 'checkboxSync':
              this.formData[this.tempIndex].inputvalue = this.tempPopupField.filter(item => {
                return item.checked == true
              })
              break;
            case 'department':
              this.formData[this.tempIndex].inputvalue = this.tempPopupTarget;
              break;
            case 'picker':
              this.formData[this.tempIndex].inputvalue = this.$refs.picker.getValues()[0];
              break;
            case 'date':
              this.formData[this.tempIndex].inputvalue = this.$common.convertDate(this.tempDate.getTime()/1000).split(' ')[0]
              break;
            case 'people':
              this.formData[this.tempIndex].inputvalue = this.$refs.sideChoose.getChoosedName();
              break;
            case 'newpicker':
              this.formData[this.tempIndex].inputvalue = this.$refs.npicker.getValues()[0].id;
              this.getVacationInfo(this.$refs.npicker.getValues()[0].id, true)
              break;
            case 'newDate':
              this.formData[this.tempIndex].inputvalue = this.$refs.newTimePicker.getData()
              // 记录这特殊的两个
              if(this.formData[this.tempIndex].inputtype == '10') {
                this.timeObj.startTime = this.$refs.newTimePicker.getData()
              } else if (this.formData[this.tempIndex].inputtype == '11') {
                this.timeObj.endTime = this.$refs.newTimePicker.getData()
              }
              break;
            default: 
              break;
          }
        } else if(this.tempType == 'picker' && this.resultField.length > 0) {
          // 由于picker自带保存机制 需要在非确定的时候进行还原
          this.$refs.picker.setValues([this.formData[this.tempIndex].inputvalue]);
        }

        // 额外的步骤, 第三方数据保存时额外调用一个接口
        if(this.tempType == 'third' && this.tempThird.length > 0) {
          let config = {
          url: `${this.$common.basePath}aatp5/public/index.php/salary/third/third_add`,
          method: 'POST',
          data: {
              fname: this.tempThird[1],
              fnumber: this.tempThird[0]
            }
          }
          this.$axios(config).then(res => {
            this.popupVisible = false
          }).catch(err => {
            this.popupVisible = false
          })
        } else {
          this.popupVisible = false
        }
      },
      /**
       * 验证表单内容 获取当前表单的最终编辑结果 （外部父组件调用）验证失败 返回false
       * @return {Object} 格式化的最终表单数据 用于保存
       */
      getFormData() {
        let result = {}
        let flag = true
        let validateData = this.$common.deepCopy(this.formData).reverse()
        validateData.forEach((item, index) => {
          // 硬性修改人员选择的数据 [] => ''
          if(item.inputtype == '5' && item.inputtype1 == '1') {
            item.inputvalue = item.inputvalue.join(',')
          }

          if(item.zjtype == 1) {
            result.title = item.inputvalue
          }
          if(item.confirmation == '1' && (item.inputvalue == [] || item.inputvalue == '')) {
            flag = false
            this.$toast({
              message: `${item.fromname} 为空!`,
              icon: 'cross'
            })
          } else { // 数据不为空 ,输出数据
            if(item.inputtype == '8') {
              result[item.inputname] = item.inputvalue.map(item => {
                return item.id
              })
            } else {
              result[item.inputname] = item.inputvalue
            }
          }
          
          // 验证金额是否过大
          if(parseInt(item.inputvalue) > 9999999999999 && item.dbtype == '3') {
            flag = false
            this.$toast({
              message: `${item.fromname} 过大!`,
              icon: 'cross'
            })
          }
          // 验证是否非整型
          if(item.inputvalue != '' && item.dbtype == '2' && !this.$common.number.test(item.inputvalue)) {
            flag = false
            this.$toast({
              message: `${item.fromname} 需要填写正确的数字`,
              icon: 'cross'
            })
          }

        })
        // 修改人员选择的数据
        result.inputname6 = [] // 添加表格相关内容 
        this.tableData.forEach((item, index) => {
          result.inputname6.push(`${item.inputname},${item.fromid}`)
          item.table.forEach((tItem, tIndex) => {
            result[tItem.inputname] = tItem.inputvalue
          })
        })
        return flag ? result : flag
      },
    }
  }
</script>

<style type="text/css" lang="less">
  .zoomze-form {
    .custom-checkbox {
      & > div {
        padding: 8px 15px;
        &.checked {
          color: #1989fa;
        }
      }
      .van-icon {
        margin-top: 2px;
        float: right;
      }
    }
    .custom-checkbox.with-button {
      max-height: 50vh;
      overflow-y: auto;
    }
    .van-number-keyboard__title {
      height: 40px;
      .van-number-keyboard__close {
        padding-top: 5px;
        padding-bottom: 5px;
      }
    }
    .van-cell {
      padding: 6.5px 16px;
      align-items: center;
    }
    .custom-cell {
      width: calc( 100% - 32px );
      padding: 6.5px 16px;
      word-wrap: nowrap;
      overflow: hidden;
      &.less-padding {
        padding: 10px 16px 4px 16px;
      }
      .cell-title {
        margin-bottom: 12px;
      }
      &.cell-added {
        display: flex;
        justify-content: space-between;
        .cell-title {
          margin-bottom: 0;
          width: 70px;
        }
        .van-ellipsis {
        }
      }
    }
    .no-data-picker {
      height: 220px;
      line-height: 220px;
      text-align: center;
    }
    .preview-wrap {
      & > * {
        float: left;
      }
      .preview-item-file {
        float: none;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .file-name, .file-type {
          position: relative;
          top: -5px;
        }
        img {
          height: 23px;
          width: 20px;
          padding-right: 12px;
        }
        .close-button {
          margin: 12px;
        }
      }
      .preview-item-img {
        position: relative;
        img {
          width: 50px;
          height: 50px;
          margin: 0 8px 8px 0;
        }
        .close-button {
          position: absolute;
          top: -20px;
          right: -12px;
          margin: 12px;
          z-index: 20;
          border-radius: 50%;
          background: #fff;
        }
      }
      .van-uploader__upload {
        height: 50px;
        width: 50px;
        background: #f5f5f5;
        border: none;
      }
    }
    .van-radio.fluid-item, 
    .van-checkbox.fluid-item {
      justify-content: space-between;
    }
    .checked-list {
      .checked-item {
        display: inline-block;
        padding: 12px 20px;
        &.is-link {
          color: #1989fa;
        }
        &.people {
          padding: 10px 15px;
          font-size: 14px;
          color: #999;
        }
      }
    }
    .group-wrap {
      margin: 12px 0;
    }
    & > form > .group-wrap:first-child {
      margin-top: 0;
    }
    .tree-item-wrap {
      .tree-placeholder {
        display: inline-block;
        width: 20px;
        height: 20px;
      }
      .tree-line {
        height: 19px;
        width: 28px;
        margin-bottom: 4px;
      }
      .tree-block {
        height: 6px;
        width: 6px;
        margin-bottom: 4px;
      }
    }
    .padding-0 {
      padding: 0 !important;
    }
    .popup-wrap {
      .popup-body {
        max-height: 65vh;
        .department-choose-block {
          max-height: 65vh;
          overflow-y: auto;
        }
      }
      .van-radio, .van-checkbox {
        padding: 12px;
      }
    }
    .no-more-text {
      text-align: center;
      padding: 15px 0;
      color: #5f5f5f;
    }
    .clear-button {
      padding: 5px;
      display: inline-block;
      &:before {
        height: 19px;
        line-height: 19px;
      }
    }
  }
</style>